<template>
  <div class="userCover">
<!--    <img src="/static/imgs/userbg.jpg"  width="100%">-->
    <img :src="cover.bjsrc"  width="100%">
    <div class="userImg">
<!--      <img src="../../../../assets/imgs/userlog.png" width="100%">-->
      <img :src="cover.usersrc" width="100%">
      <h4 style="color: #fff;text-align: center; margin-top: 2px;">{{ cover.username }}</h4>
    </div>
  </div>
</template>

<script>
export default {
  name: "myIndexUsercover",
  props: {
    //bjsrc usersrc username
    cover:{
      type: Object,
      default() {
        return {}
      }
    }
  }
}
</script>

<style scoped>
.userCover{
  position: relative;
  width: 100%;
  height: auto;
}
.userImg{
  position: absolute;
  width: 30%;
  height: auto;
  top: 20%;
  left: 35%;
  z-index: 2;
}
.userImg img{
  border-radius:50%;
  border:solid 1px #f5ccd6;
}
</style>